<template>
	<div class="factory_list table-theme">
		<head-title title="合作--工厂列表"></head-title>
		<el-card>
			<div class="top-menu">
				<div class="menu-left">
					<tabs-view :list="classifyList" :tabsIndex="type" @roleType="roleType"></tabs-view>
					<el-select style="width:160px" v-model="factoryType" placeholder="请选择" @change="init()" v-if="!is_subsidiary_corporation">
						<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
					</el-select>

					<el-date-picker style="margin-left: 10px;width:160px" @change="selectTime" v-model="selectModel.time" type="date" placeholder="选择日期"
					 value-format="yyyy-MM-dd"></el-date-picker>
					 
					 <el-select style="margin-left: 10px;width:160px" v-model="order_by" placeholder="请选择" @change="init()">
					 	<el-option v-for="item in orderOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
					 </el-select>
					<!-- <el-select style="margin-left: 10px;width:160px" v-model="filiale_id" placeholder="请选择子公司" @change="init()" v-if="!is_subsidiary_corporation">
					 	<el-option v-for="item in filialeList" :key="item.filiale_id" :label="item.name" :value="item.filiale_id"></el-option>
					 </el-select> -->

				</div>

				<div class="menu-right">
					<refresh-button @refresh="refreshPage"></refresh-button>
					<search-view :option="searchOption" @value="goSearch" @clear="refreshPage"></search-view>
					<div class="add" style="margin-right: 10px;">
						<el-button type="primary" @click="addFactory" v-if="admin_id == 6 || admin_id == 1 || admin_id == 8 || is_subsidiary_corporation">添加工厂</el-button>
					</div>
					<div class="derive" style="margin-right:10px">
						<el-button type="primary" @click="onDerive">导出</el-button>
					</div>
				</div>
			</div>
			<!-- <div v-if="admin_id == 1 || admin_id == 9" style="margin-top:10px">
				<el-button type="primary" size="small" @click="onSyncFactory('double')">批量同步到我家更美</el-button>
			</div> -->
			<p style="text-align: right;line-height: 30px;">总店铺数：{{ total }}</p>
			<el-table :data="list" @selection-change="handleSelectionChange">
				<el-table-column type="selection" width="55"> </el-table-column>
				<el-table-column label="序号" align="center" prop="factory_id" width="50"></el-table-column>
				<el-table-column label="用户序号" align="center" prop="user_id"></el-table-column>
				<el-table-column label="编号" align="center" prop="factory_sn" width="50"></el-table-column>
				<el-table-column label="风格" align="center" prop="factory_style_sn"></el-table-column>
				<el-table-column label="电话" align="center" prop="phone"></el-table-column>
				<el-table-column label="logo" align="center" width="80">
					<template slot-scope="scope">
						<el-image :src="scope.row.logo" style="width: 50px; height: 50px; vertical-align: top;"></el-image>
					</template>
				</el-table-column>
				<el-table-column label="分类图片" align="center" width="80">
					<template slot-scope="scope">
						<ImgPopover :src="scope.row.category_img"></ImgPopover>
					</template>
				</el-table-column>
				<el-table-column label="简称" align="center" prop="factory_name"></el-table-column>
				<el-table-column label="全称" align="center" prop="name"></el-table-column>
				<el-table-column label="佣金比例" align="center">
					<template slot-scope="scope">{{scope.row.commission_coefficient}}%</template>
				</el-table-column>
				<el-table-column label="接单权重" align="center">
					<template slot-scope="scope">{{scope.row.distribution_weight}}</template>
				</el-table-column>
				<el-table-column label="应收保证金" align="center" min-width="120">
					<template slot-scope="scope">{{scope.row.bond_price}}</template>
				</el-table-column>
				<el-table-column label="已收保证金" align="center" min-width="120">
					<template slot-scope="scope">{{scope.row.bond_money}}</template>
				</el-table-column>
				<el-table-column label="客服ID" align="center" prop="service_id"></el-table-column>
				<el-table-column label="跟单员" align="center" v-if="!is_subsidiary_corporation">
					<template slot-scope="scope">
						<p>{{scope.row.server_name  ? scope.row.server_name:'无'}}</p>
					</template>
				</el-table-column>
				<el-table-column label="是否关注公众号" align="center" prop="style" v-if="!is_subsidiary_corporation" min-width="140">
					<template slot-scope="scope">
						<p>{{scope.row.is_attention == 0 ? '未关注公众号':'已关注'}}</p>
					</template>
				</el-table-column>
				<el-table-column label="自营价系数" align="center" prop="self_coefficient" v-if="is_subsidiary_corporation"></el-table-column>
				<el-table-column label="零售价系数" align="center" prop="retail_coefficient" v-if="is_subsidiary_corporation"></el-table-column>
				<el-table-column label="风格" align="center" prop="style"></el-table-column>
				<!-- <el-table-column label="子公司" align="center" prop="filiale_name"></el-table-column> -->
				<el-table-column label="场地	" align="center" prop="factory_city"></el-table-column>
				<el-table-column label="排序" align="center" prop="" width="100">
					<template slot-scope="scope">
						<el-input v-model="scope.row.sort" placeholder="" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"
						 @keyup.enter.native="postSort(scope.row.sort, scope.row.factory_id)" @blur="postSort(scope.row.sort, scope.row.factory_id)"></el-input>
					</template>
				</el-table-column>
				<el-table-column label="商品数量" align="center" prop="" width="80">
					<template slot-scope="scope">
						<p style="cursor: pointer;" @click="goFGoodsList(scope.row.factory_id,scope.row.factory_sn)">{{scope.row.goods_num}}</p>
					</template>
				</el-table-column>
				<el-table-column label="类型" align="center" prop="type_name" v-if="!is_subsidiary_corporation"></el-table-column>
				<el-table-column label="上下架" align="center">
					<template slot-scope="scope">
						<el-switch v-model="scope.row.is_online" :active-value="1" :inactive-value="2" @change="upDown($event, scope.row.factory_id)"></el-switch>
					</template>
				</el-table-column>
				<el-table-column label="是否免检" align="center" width="120">
					<template slot-scope="scope">
						<el-switch v-model="scope.row.is_exempt" :active-value="1" :inactive-value="0" @change="upDownSenior($event, scope.row.factory_id)"></el-switch>
					</template>
				</el-table-column>
				<el-table-column label="添加时间" align="center" prop="add_time"></el-table-column>
				<el-table-column label="操作" align="center" width="120" fixed="right">
					<template slot-scope="scope">
						<el-button type="primary" size="mini" @click="edit(scope.row.factory_id)" style="margin-bottom:10px">修改信息</el-button>
						<!-- <el-button type="primary" size="mini" @click="getQrCode(scope.row.factory_id)" style="margin-bottom:10px">生成二维码</el-button>  -->
						<el-button type="primary" size="mini" @click="showDialog(scope.row)" style="margin-bottom:10px">归属</el-button>
						<!-- <el-button type="primary" size="mini" @click="exportDataExcel(scope.row.factory_id)" v-if="admin_id == 1 || admin_id == 8 || admin_id == 12 || admin_id == 9" style="margin-bottom:10px">商品导出</el-button> -->
						<!-- <el-button type="primary" size="mini" @click="onSyncFactory('one',scope.row.factory_id)" v-if="admin_id == 1 || admin_id == 9">同步到我家更美</el-button> -->
					</template>
				</el-table-column>
			</el-table>
			<div class="pages">
				<el-pagination background layout="prev, pager, next, jumper" :total="total" @current-change="init" :current-page="page"></el-pagination>
			</div>
		</el-card>
		<el-dialog title="" :visible.sync="qrQialog" center :modal-append-to-body="false" width="300px">
			<el-image style="width: 100%; height: 100%" :src="qrCodeUrl"></el-image>
		</el-dialog>
		<!-- 归属弹框 -->
		<el-dialog title="归属" :visible.sync="ascriptionDialog" width="500px" center :modal-append-to-body="false">
			<el-form :model="ascriptionForm" :rules="ascriptionFormRules" ref="ascriptionForm" label-width="120px">
				<el-form-item label="跟单人员:" prop="user_id">
					<el-select v-model="ascriptionForm.user_id" placeholder="请选择">
						<el-option v-for="item in service_list" :key="item.user_id" :label="item.nickname" :value="item.user_id"></el-option>
					</el-select>
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="ascriptionDialog = false">取 消</el-button>
				<el-button type="primary" @click="confirmClick">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
	import ImgPopover from '@/components/ImgPopover';
	import addFactory from '@/components/layer-dialog/add-factory.vue';
	import sonMixin from '@/utils/sonMixin';
	import TabsView from '@/components/TabsView'
	export default {
		name: 'factory_list',
		mixins:[sonMixin],
		components: {
			ImgPopover,
			addFactory,
			TabsView
		},
		data() {
			return {
				order_by:'sort',
				filiale_id:'',
				filialeList:[],
				orderOptions: [{
						value: 'sort',
						label: '序号排序'
					}, {
						value: 'add_time',
						label: '时间排序'
					}
				],
				factoryType: 0,
				options: [{
						value: 0,
						label: '请选择工厂类型'
					}, {
						value: 1,
						label: '内部工厂'
					},
					{
						value: 2,
						label: '外部工厂'
					}
				],
				admin_id: localStorage.getItem('admin_id'),
				searchOption: [{
						value: 0,
						label: '工厂简称'
					},
					{
						value: 1,
						label: '电话'
					},
					{
						value: 2,
						label: '工厂ID'
					},
					{
						value: 3,
						label: '工厂编号'
					},
					{
						value: 4,
						label: '工厂风格'
					}
				],
				selectContent: '', // 分类搜索平输入框的值
				classSelect: '', // 分类搜索
				list: [], // 列表
				total: 0,
				totalData: 0,
				type: 0,
				page: 0,
				classifyList: [ '所有', '上架' ,  '下架' ,  '待审核' ],
				selectModel: {
					time: '' // 时间
				},
				qrQialog: false,
				qrCodeUrl: '',
				ascriptionDialog: false, // 归属弹窗
				ascriptionFormRules: {
					user_id: [{
						required: true,
						message: '请输入内容'
					}]
				},
				ascriptionForm: {
					user_id: '',
					factory_id:''
				},
				service_list:[
					{
						user_id:3151,
						nickname:'工厂服务员-小廖'
					},
					{
						user_id:86725,
						nickname:'工厂服务员-小瓶'
					}
				],
				factorySelection:[]
			};
		},
		methods: {
			// 初始化列表
			init(e) {
				this.page = e;
				let data = {
					page: e - 1 ? e - 1 : 0,
					limit: 10,
					is_online: this.type,
					order_by: this.order_by
				};

				if (this.type == 0) {
					delete data.is_online;
				}
				if(this.is_subsidiary_corporation){
					data.filiale_id = localStorage.getItem('filiale_id')
				}else{
					data.filiale_id = this.filiale_id
				}
				if (this.classSelect == 0) {
					data.keyword = this.selectContent;
				} else if (this.classSelect == 1) {
					data.phone = this.selectContent;
				} else if (this.classSelect == 2) {
					data.factory_id = this.selectContent;
				} else if (this.classSelect == 3) {
					data.factory_sn = this.selectContent;
				} else if (this.classSelect == 4) {
					data.factory_style_sn = this.selectContent;
				}
				if (this.factoryType != 0) {
					data.type = this.factoryType
				}

				// 选择了时间
				if (this.selectModel.time != '' && this.selectModel.time != null) {
					data.add_time = this.selectModel.time;
				}

				this.$http(this.$ApiList.FactoryList, data).then(res => {
					this.list = [];
					if (res.datas.data.length != 0) {
						let type_name = ['平台工厂', '合作工厂'];
						if(res.datas.data){
							res.datas.data.forEach(item => {
								let index = item.type - 1;
								item.type_name = type_name[index];
								this.list.push(item);
							});
						}
						this.total = res.datas.count;
					}
				});
			},
			goSearch(classSelect, selectContent) {
				this.classSelect = classSelect;
				this.selectContent = selectContent;
				this.total = 0;
				this.init();
			},
			roleType(type) {
				this.type = type;
				this.init();
			},
			// 上下架
			upDown(e, factory_id) {
				let data = {
					factory_id: factory_id,
					is_online: e
				};
				this.$http(this.$ApiList.FactoryDown, data).then(res => {
					this.$layer.msg('操作成功');
				});
			},
			upDownSenior(e,factory_id){
				let data = {
					factory_id: factory_id,
					is_exempt: e
				};
				this.$http(this.$ApiList.FactoryExempt, data).then(res => {
					this.$layer.msg('操作成功');
				});
			},
			refreshPage() {
				this.page = 1;
				this.type = '';
				this.classSelect = '';
				this.selectContent = '';
				this.init();
			},
			edit(factory_id) {
				this.$router.push({
					path: '/edit_factory',
					query: {
						id: factory_id
					}
				});
			},
			addFactory() {
				this.$layer.iframe({
					title: '添加工厂',
					maxmin: true,
					area: ['50%', '60%'],
					content: {
						content: addFactory, //传递的组件对象
						parent: this, //当前的vue对象
						data: {} //props
					}
				});
			},
			postSort(sort, factory_id) {
				if (sort < 0 || sort === "") {
					this.$layer.msg('请输入正确的排序');
					return
				}
				let data = {
					sort: sort,
					factory_id: factory_id,
				}
				this.$http(this.$ApiList.FactorySort, data).then(res => {});
			},
			goFGoodsList(factory_id, factory_sn) {
				this.$router.push({
					path: '/f_goods_list',
					query: {
						factory_id: factory_id,
						factory_sn: factory_sn
					}
				});
			},
			selectTime() {
				this.init();
			},
			getQrCode(factory_id) {
				this.$message({
					message: '生成中',
					type: 'warning'
				});
				this.$http(this.$ApiList.GetFactoryQrCode, {
					factory_id
				}).then(res => {
					this.qrCodeUrl = res.datas
					this.qrQialog = true
					this.$message({
						message: '生成成功',
						type: 'success'
					});
				});
			},
			showDialog(item) {
				this.ascriptionForm.factory_id = item.factory_id;
				this.ascriptionDialog = true;
				this.$nextTick(() => {
					this.$refs.ascriptionForm.clearValidate();
				});
			},
			//提交
			confirmClick() {
				this.$refs['ascriptionForm'].validate(valid => {
					if (valid) {
						this.$http(this.$ApiList.FactoryBelong, this.ascriptionForm).then(res => {
							this.$layer.msg('操作成功');
							this.ascriptionDialog = false;
							});
					} else {
						this.$layer.msg('请填写完整信息后提交');
					}
				});
			},
			// 获取子公司列表
			FilialeItems(){
				this.$http(this.$ApiList.FilialeItems,{order_by:'filiale_id',asc:1}).then(res=>{
					this.filialeList = res.datas
				})
			},
			exportDataExcel(factory_id){
				window.open(`${this.$domain}furniture/Adminexcel/FactoryGetGoodsDataExcel?factory_id=${factory_id}`)
			},
			onDerive(){
				let url = `${this.$domain}furniture/Adminexcel/FactoryListGetData?order_by=${this.order_by}&`
				if(this.type != 0){
					url += `is_online=${this.is_online}&`
				}
				if(this.is_subsidiary_corporation){
					url += `filiale_id=${localStorage.getItem('filiale_id')}&`
				}else{
					url += `filiale_id=${this.filiale_id}&`
				}
				if(this.selectContent != ''){
					if(this.classSelect == 0){
						url += `keyword=${this.selectContent}&`
					}else if(this.classSelect == 1){
						url += `phone=${this.selectContent}&`
					}else if(this.classSelect == 2){
						url += `factory_id=${this.selectContent}&`
					}else if(this.classSelect == 3){
						url += `factory_sn=${this.selectContent}&`
					}else if(this.classSelect == 4){
						url += `factory_style_sn=${this.selectContent}&`
					}
				}
				if(this.factoryType != 0){
					url += `type=${this.factoryType}&`
				}
				if(this.selectModel.time != '' && this.selectModel.time != null){
					url += `add_time=${this.selectModel.time}`
				}
				window.open(url);
			},
			handleSelectionChange(val){
				this.factorySelection = val
			},
			// 同步工厂
			onSyncFactory(type,result){
				let data = {
					factory_id:''
				}
				if(type === 'one'){
					data.factory_id = result
				}else{
					if(!this.factorySelection.length){
						this.$message.error('请至少选择一个商品')
						return
					}
					data.factory_id = this.factorySelection.map(item=>{
						return item.factory_id
					}).join(',')
				}
				this.$http(this.$ApiList.FactorySynWJGM,data).then(res=>{
					this.$message.success('已同步到我家更美系统')
					this.init(this.page)
				})

			}	
		},
		created() {
			this.init();
			this.FilialeItems();
		},
		mounted () {
			if(this.is_subsidiary_corporation){
				this.classifyList.pop();
			}
		}
	};
</script>
<style lang="scss" scoped>

</style>
